<template>
  <div>
    <p>{{message}},我是子组件</p>
    <h1>{{msg}}</h1>
    <span>子组件的输入框1：</span><input type="text" v-model="newMsg"><br>
    <span>子组件的输入框2：</span><input type="text" v-model="newNewMsg">
  </div>
</template>
<script>
export default {
  data() {
    return {
      message: 'hello',
      // 在子组件中新创建一个变量，用来保存父组件传过来的值，可用于修改
      newMsg: this.msg
    }
  },
  // 2.通过props属性接受数据，值是一个字符串数组
  props: ['msg', 'msg2'],
  // 在子组件中创建一个计算属性，用来保存父组件传过来的值
  computed: {
    newNewMsg: function() {
      return this.msg
    }
  }
}
</script>
<style lang="">
  
</style>